/**
 * Created by whj57 on 2016/12/1.
 */
import moment from 'moment'
import React from 'react'
import {energyInfo} from 'apis'
import BaseComponent from 'basecomponent'
import './style.scss'
import {homePage} from 'icons'
import NumberDiv from 'number-div'
import PVChars from './PV-charts'
import apis from 'apis'
import {
  MySelect, SelectList, SelectState
} from 'redux-components/dropdownselect'
import {getParentNode} from 'utils'
import * as staticType from 'utils/staticType'
import {DateSelect, DateSelectState} from 'dropdownselect/datepicker'
import Button from "button";
import RankView from "./rank-view";


class HomePage extends BaseComponent {
  constructor() {
    super(...arguments);
    let now = new Date();
    let year = now.getFullYear();
    let month = now.getMonth();
    let day = now.getDate();
    let hour = now.getHours();
    let minute = now.getMinutes();
    let second = now.getSeconds();
    let dateStates = new DateSelectState([
      ['start', {value: moment(new Date(year, month, day)).toDate(), isMini: true, endWith: 'day'}],
      ['end', {
        value: moment(new Date(year, month, day)).add(1, 'day').add(-1, 'second').toDate(),
        isMini: true,
        endWith: 'day'
      }]
    ]);
    this.state = {
      hour: hour,
      minute: minute,
      second: second,
      searchType: staticType.timeBaseOnEnum.day,
    };
  }

  componentDidMount(){

  }

  render(){
    const leftData = {
      titleName:'观看量最多的企业',
      data:['Alibaba企业','Alibaba企业','Alibaba企业','Alibaba企业','Alibaba企业','阿里巴巴企业阿里巴巴与四十大盗','阿里巴巴企业',
        '阿里巴巴企业','阿里巴巴企业','阿里巴巴企业',],
    };
    const rightData={
      titleName:'观看量最多的岗位',
      data:['Alibaba企业','Alibaba企业','Alibaba企业','Alibaba企业','Alibaba企业','阿里巴巴企业阿里巴巴与四十大盗','阿里巴巴企业',
        '阿里巴巴企业','阿里巴巴企业','阿里巴巴企业',],
    };
    return(
      <div className="sem-main-content">
        <div className="home-page-wrapper">
          <div className="page-top">
            <NumberDiv icon={homePage.people} titleName="观看人数" number={60000000}/>
            <NumberDiv icon={homePage.money} titleName="总充值额" number={60000000}/>
            <NumberDiv icon={homePage.company} titleName="企业总数" number={60000000}/>
            <NumberDiv icon={homePage.work} titleName="岗位总数" number={60000000}/>
          </div>
          <div className="page-middle">
            <div className={'middle-title-wrapper'}>
              <div className={'title-text'}>访问时间轴</div>
              <div className={'title-button-wrapper'}>
                <Button className={'day-button clicked'} onClick={()=>{}}>日</Button>
                <Button className={'week-button'}>周</Button>
                <Button className={'month-button'}>月</Button>
                <Button className={'year-button'}>年</Button>
              </div>
            </div>
            <PVChars/>
          </div>
          <div className={'page-bottom'}>
            <div className={'bottom-wrapper'}>
              <RankView titleName={leftData.titleName} data={leftData.data}/>
            </div>
            <div className={'bottom-wrapper'}>
              <RankView titleName={rightData.titleName} data={rightData.data}/>
            </div>
          </div>
        </div>
      </div>
    );
  }
}

module.exports = HomePage;
